<template>
	<view class="beijingse">
		<!-- 普通购买弹框 -->
		<view>
			<u-popup :show="ptshow" @close="ptclose" mode="center" :round="10">
				<view>
					<view class="mainpadding">
						<view class="textcenter bigtext">温馨提示</view>
						<view class="ershui textcenter margin_top7">此购买方式不参与平台返利活动，<br>平台正常按购买数量发货。</view>
					</view>
					<view class="flexbetween margin_top7">
						<view class="quxiaobtn" @click="ptshow = false">取消</view>
						<view class="renzbtn" @click="tzqrdd(1)">继续支付</view>
					</view>
				</view>
			</u-popup>
		</view>
		<!-- 返利购买弹框 -->
		<view>
			<u-popup :show="flshow" @close="flclose" mode="center" :round="10">
				<view>
					<view class="mainpadding">
						<view class="textcenter bigtext">温馨提示</view>
						<view class="ershui textcenter margin_top7">此购买方式参与平台返利活动<br>请按需购买切勿非理性消费</view>
					</view>
					<view class="flexbetween margin_top7">
						<view class="quxiaobtn" @click="flshow = false">取消</view>
						<view class="renzbtn" @click="tzqrdd(2)">继续支付</view>
					</view>
				</view>
			</u-popup>
		</view>
		<!-- 产品参数弹框 -->
		<view>
			<u-popup :show="cpshow" @close="cpclose" mode="bottom" :round="10">
				<view class="mainpadding">
					<view class="textcenter sanstext">产品参数</view>
					<view class="xiahuax flexleft margin_top" v-for="(item,index) in dataAll.goods_sx" :key="index">
						<view class="qianhtext kuandu">{{item.title}}</view>
						<view class="ershib">{{item.des}}</view>
					</view>
					<view class="margin_top bigbtn">完成</view>
				</view>
			</u-popup>
		</view>
		<!-- 服务 -->
		<view>
			<u-popup :show="fwshow" @close="fwclose" mode="bottom" :round="10">
				<view class="mainpadding">
					<view class="textcenter sanstext">服务</view>
					<view class="xiahuax margin_top" v-for="(item,index) in dataAll.shop.service_data" :key="index">
						<view class="bigbtext">{{item.name}}</view>
						<view class="qianhtext margin_top2">{{item.description}}</view>
					</view>
					<view class="margin_top bigbtn">完成</view>
				</view>
			</u-popup>
		</view>
		<!-- 规格 -->
		<view>
			<u-popup :show="ggshow" @close="ggshow=false" mode="bottom" :round="10">
				<view class="mainpadding">
					<view class="flexbottom1">
						<view class="guigslt margin_right2">
							<image :src="dataAll.image_text" mode=""></image>
						</view>
						<view class="">
							<view class="flexleft">
								<view class="dahtext margin_right1" v-if="price!=''&& valueType==1 || valueType==3 ||valueType==4">¥{{price}}</view>
								<view class="dahtext margin_right1" v-if="fanli_price!=''&& valueType==2">¥{{fanli_price}}</view>
								<view class="huisetextjx" v-if="market_price!=''">￥{{market_price}}</view>
							</view>
							<view class="margin_top2 erslhuang" v-if="stock!=''">库存：{{stock}}</view>
						</view>
					</view>
					<view class="padding_top">
						<template v-if="dataAll.spu.length">
							<view class="" v-for="item in dataAll.spu" :key="item.id">
								<view class="titletext margin_top">{{item.name}}</view>
								<view class="flexleft flex_wrap">
									<view :class="item.selecttext==ite?'margin_top margin_right2 huangg':'margin_top margin_right2 huigg'"
										v-for="(ite) in item.item" :key="ite" @click="checkgg(item,ite)">{{ite}}</view>
								</view>
							</view>
						</template>
						<view class="flexbetween margin_top">
							<view class="titletext ">购买数量</view>
							<view class="jiajian">
								<view class="jianhao" @click="reducenum">
									<view class="line"></view>
								</view>
								<view class="xhtext">{{buynumber}}</view>
								<view class="jiahao" @click="addnum"></view>
							</view>
						</view>
					</view>
					<view class="margin_top bigbtn" @click="ggclose">{{valueType==1?"普通购买":valueType==2?"返利购买":"确定"}}</view>
				</view>
			</u-popup>
		</view>
		<!-- 轮播图 -->
		<view class="u-demo-block">
			<u-swiper :list="list6" @change="e => currentNum = e.current" :autoplay="false" indicatorStyle="right: 20px"
				height="375" imgMode="aspectFit " indicator indicatorMode="line">
				<view slot="indicator" class="indicator-num">
					<text class="indicator-num__text">{{ currentNum + 1 }}/{{ list6.length }}</text>
				</view>
			</u-swiper>
		</view>
		<!-- 内容 -->
		<view class="neirong">
			<view class="mainpadding">
				<view class="mainpadding ffffff radius">
					<view class="flexbetween">
						<view class="flexleft">
							<view class="margin_right3 qianshu" v-if="dataAll.type==1">￥{{dataAll.goodsprice.price}}
							</view>
							<view class="margin_right3 qianshu2" v-if="dataAll.type==2">
								{{dataAll.goodsprice.fl_price}}福利券+{{dataAll.goodsprice.price}}现金
							</view>
							<view class="huisetextjx">￥{{dataAll.goodsprice.market_price}}</view>
						</view>
						<view class="huisetext">销量{{dataAll.sales}}</view>
					</view>
					<view class="notitletext margin_top">{{dataAll.title}}</view>
				</view>
				<view class="ffffff mainpadding margin_top">
					<view class="flexbetween" v-if="dataAll.spu.length">
						<view class="flexleft" >
							<view class="huiesb margin_right3">规格</view>
							<view class="heiesb yhxiank">{{guige_text==''?'请选择规格':guige_text}}</view>
						</view>
						<view class="righticon"></view>
					</view>
					<view class="flexbetween margin_top" @click="dkfwtk">
						<view class="flexleft">
							<view class="huiesb margin_right3">服务</view>
							<view class="heiesb yhxiank">{{dataAll.shop.service_text}}</view>
						</view>
						<view class="righticon"></view>
					</view>
					<view class="flexbetween margin_top" @click="dkcpcs">
						<view class="flexleft">
							<view class="huiesb margin_right3">参数</view>
							<view class="heiesb yhxiank">{{dataAll.goods_sx_text}}</view>
						</view>
						<view class="righticon"></view>
					</view>
				</view>
				<view class="ffffff mainpadding radius margin_top">
					<view class="flexbetween" @click="tzdpxq(dataAll.shop_id)">
						<view class="flexleft">
							<view class="dianslt margin_right2">
								<image :src="dataAll.shop.logo_text" mode=""></image>
							</view>
							<view class="">
								<view class="titletext">{{dataAll.shop.name}}</view>
								<view class="flexleft margin_top1">
									<view class="herse margin_right3">描述:{{dataAll.shop.score_describe}}</view>
									<view class="herse margin_right3">服务:{{dataAll.shop.score_service}}</view>
									<view class="herse margin_right3">物流:{{dataAll.shop.score_logistics}}</view>
								</view>
							</view>
						</view>
						<view class="flexright">
							<view class="linefs"></view>
							<view class="flexcolumn margin_right4">
								<view class="fstext">{{dataAll.shop.like}}</view>
								<view class="nostrongtext">粉丝</view>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 商品详情和商品评价 -->
			<view class="ffffff mainpadding2 margin_top1">
				<view class="flexcenter ffffff">
					<u-tabs :list="list1" lineColor="#FAB536" @click="clicktabtow" :activeStyle="{
					    color: '#333333',
					    fontWeight: 'bold',
					    transform: 'scale(1.05)'
					}" :inactiveStyle="{
					            color: '#999999',
								 fontWeight: 'bold',
					            transform: 'scale(1)'
					        }" itemStyle="padding-left: 35px; padding-right: 35px; height: 44px;"></u-tabs>
				</view>
				<view class="" v-if="currenttabtow == 0">
					<u-parse :content="dataAll.content"></u-parse>
				</view>
				<view class="" v-if="currenttabtow == 1">
					<view class="zwtimg flexcenter" v-if="!list.data.length">
						<image src="../../static/image/system/zwt.png" mode=""></image>
					</view>
					<view class="xiahuax margin_top" v-for="item in list.data" :key="item.id" v-if="list.data.length">
						<view class="flexbetween">
							<view class="flexleft">
								<view class="pjslt margin_right2">
									<image :src="item.user.avatar_text" mode=""></image>
								</view>
								<view class="">
									<view class="bigbtext">{{item.user.nickname}}</view>
									<view class="flexleft margin_top1">
										<view class="wujiaox margin_right1" v-for="ite in item.score_describe"></view>
									</view>
								</view>
							</view>
							<view class="ershui">{{item.createtime_text}}</view>
						</view>
						<view class="margin_top2" style="margin-left: 93rpx;">
							<view class="ershui">{{item.content}}</view>
							<view class="flexleft margin_top">
								<view class="mjplt margin_right1" v-for="ite in item.images_text" :key="ite">
									<image :src="ite" mode=""></image>
								</view>
							</view>
							<!-- <view class="margin_top huibox mainpadding">
								<view class="ershui">亲，感谢您对我们的认可，我们会再接再厉的</view>
							</view> -->
						</view>
					</view>
				</view>
			</view>
		</view>
		<!-- 固定底部 -->
		<view class="gudingdb ffffff">
			<view class="flexbetween">
				<view class="flexleft">
					<view class="margin_right2" @click="tzdpxq(dataAll.shop_id)">
						<view class="dianpu"></view>
						<view class="heierse margin_top1">店铺</view>
					</view>
					<view class="margin_right2" @click="addcar" v-if="dataAll.type==1">
						<view class="gouwuc"></view>
						<view class="heierse">加入购物车</view>
					</view>
				</view>
				<view class="shuangpinbtn" v-if="dataAll.type==1">
					<view class="flexleft">
						<view class="" style="margin-right: 94rpx;" @click="ptgmtk">
							<view class="huigongtext textcenter">￥{{price}}</view>
							<view class="xiaohhtext">直接普通购买</view>
						</view>
						<view class="" @click="flgmtk">
							<view class="bigbaitext textcenter">￥{{fanli_price}}</view>
							<view class="xiaobtext">全额返利购买</view>
						</view>
					</view>
				</view>
				<!-- 立即兑换 -->
				<view class="ljduih" v-if="dataAll.type==2" @click="lijidh">立即兑换</view>
			</view>
		</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				ptshow: false,
				flshow: false,
				cpshow: false, //产品参数
				fwshow: false, //服务
				ggshow: false, //规格
				currenttabtow: 0,
				list1: [{
						name: '商品详情',
					},
					{
						name: '商品评价',
					}
				],
				list6: [],
				lastmsg: {
					goods_id: ""
				},
				currentNum: 0, //轮播图当前位置
				dataAll: {
					activity_text: "",
					activity_type: "",
					category_attribute: null,
					category_id: 0,
					comment: 0,
					content: "",
					distribution_text: "",
					flag: "",
					flag_text: "",
					freight_id: 0,
					goods_sx: [{
						title: "",
						des: "",
						status_text: ""
					}],
					goodsprice: {
						difference: "",
						fl_price: "",
						id: 0,
						market_price: "",
						price: "",
						sales: 0,
						sn: "",
						state: "",
						status_text: "",
						stock: 0,
						thumbnail: "",
						weigh: "",
					},
					id: "",
					image: "",
					image_text: "",
					images: "",
					images_text: [],
					like: 0,
					moderate: 0,
					negative: 0,
					payment: 0,
					plat_status: "",
					praise: 0,
					price: "",
					sales: 0,
					shop: {
						create_time_text: "",
						like: 1,
						logo_text: "",
						name: "",
						score_describe: 0,
						score_logistics: 0,
						score_service: 0,
						service_data: [{
							name: "",
							description: "",
							status_text: "",
						}],
						service_ids: "",
						status_text: "",
						update_time_text: "",
					},
					shop_id: 1,
					sku: [{
						difference: "",
						fl_price: "",
						id: 0,
						market_price: "",
						price: "",
						sales: 0,
						sn: "",
						state: "",
						status_text: "",
						stock: 0,
						thumbnail: "",
						weigh: "",
					}],
					specs_text: "",
					spu: [{
						id: 0,
						name: "",
						item: "",
						status_text: ""
					}],
					status: "",
					status_text: "",
					stock_text: "",
					title: "",
					views: 0,
				},
				price: "", //规格弹框价格
				market_price: "", //规格弹框划线价格
				fanli_price: "", //返利价格
				stock: "", //库存
				sku_id: "", //规格id
				guige_text: "", //选择的规格文本
				buynumber: 1, //购买数量
				guigeflag: false, //规格标识，判断是否选中规格，选中为true否则为false
				// 商品评价
				page: 1,
				limit: 12,
				list: {
					data: []
				},
				valueType:1,//1普通购买，2返利购买,3购物车
			}
		},
		onShow() {
			this.ptshow = false
			this.flshow = false
			this.cpshow = false //产品参数
			this.fwshow = false //服务
			this.ggshow = false //
		},
		watch: {
			'dataAll.spu': {
				handler(newval) {
					let arr = []
					newval.forEach(item => {
						arr.push(item.selecttext)
					})
					// 规格换算价格
					let text = arr.join()
					this.dataAll.sku.forEach(item => {
						// 如果后台返回规格与前端规格一致，赋值换算
						if (item.difference == text) {
							this.price = item.price //价格赋值
							this.market_price = item.market_price //划线价格赋值
							this.fanli_price = item.fl_price
							this.stock = item.stock //库存
							this.guige_text = text //规格文本赋值
							this.sku_id = item.id
						}
					})
					// 计算是否选择规格
					let num = 0
					arr.forEach(item => {
						if (item != "") {
							num = num + 1
						}
					})
					if (num != arr.length) {
						this.guigeflag = false
					} else {
						this.guigeflag = true
					}
				},
				deep: true
			}
		},
		onLoad(options) {
			//接收对象
			this.lastmsg = JSON.parse(decodeURIComponent(options.msg));
			this.init()
			this.getdetail()
		},
		methods: {
			getdetail() {
				httpRequest.request('/api/goods/goodsDetail', 'POST', {
					goods_id: this.lastmsg.goods_id,
				}).then(res => {
					res.data.spu.forEach(current => {
						current.item = current.item.split(",")
						this.$set(current, "selecttext", "")
					})
					this.dataAll = res.data
					this.list6 = res.data.images_text
					this.price = res.data.goodsprice.price
					this.market_price = res.data.goodsprice.market_price
					this.fanli_price = res.data.goodsprice.fl_price
				})
			},
			// 规格选择
			checkgg(item, ite) {
				item.selecttext = ite
			},
			// 数量减
			reducenum() {
				if (this.buynumber == 1) {
					httpRequest.toast("不能再减了哦！")
					return
				}
				this.buynumber = Number(this.buynumber) - 1
			},
			//数量减
			addnum() {
				this.buynumber = Number(this.buynumber) + 1
			},
			// 加入购物车
			addcar() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.valueType = 3
				this.ggshow = true
				// if (!this.guigeflag) {
				// 	httpRequest.toast("请先选择规格")
				// 	return
				// }
				
			},
			// 进入店铺
			tzdpxq(id) {
				uni.navigateTo({
					url: '/pages/homepage/dianpuxq?id=' + id
				})
			},
			// 跳转确认订单
			tzqrdd(value) {
				// 1普通商品,2返利商品
				if (value == 1) {
					this.ptshow = false
				} else {
					this.flshow = false
				}
				let obj = {
					buy_type: value,
					type: 'detail',
					data: [],
					goods_type: 1 //1普通商品，2福利券商品
				}
				obj.data.push({
					goods_id: this.dataAll.id,
					number: this.buynumber,
					sku_id: this.sku_id
				})
				uni.navigateTo({
					url: '/pages/homepage/querendingdan?msg=' + encodeURIComponent(JSON.stringify(obj))
				})
			},
			// 商品评论
			init(isPage, page) {
				let _this = this;
				httpRequest.request('/api/goods/goodsCommentList', 'GET', {
					page: page || 1,
					limit: _this.limit,
					goods_id: this.lastmsg.goods_id
				}, false, false, true).then(res => {
					if (res.code == 1) {
						let resList = res.data;
						let dataList = _this.list;
						if (isPage == true) {
							_this.list.data = dataList.data.concat(resList.data);
						} else {
							this.list = res.data
							_this.list.data = resList.data;
						}
					}
				}).catch(err => {
					httpRequest.toast(err.msg);
				})
			},
			onReachBottom() {
				let _this = this;
				let list = _this.list;
				let page = _this.page;
				if (list.last_page <= page) {
					return false;
				}
				page++;
				_this.page = page;
				_this.init(true, page);
			},
			// 规格
			ggclose() {
				if (!this.guigeflag) {
					httpRequest.toast("请先选择规格")
					return
				}
				this.ggshow = false
				if(this.valueType==1){
					this.ptshow = true
				}else if(this.valueType==2){
					this.flshow = true
				}else if(this.valueType==3){
					httpRequest.request('/api/cart/addCart', 'POST', {
						shop_id: this.dataAll.shop_id,
						goods_id: this.dataAll.id,
						number: this.buynumber,
						sku_id: this.sku_id,
					}).then(res => {
						httpRequest.toast(res.msg)
					})
				}else if(this.valueType==4){
					let obj = {
						buy_type: "",
						type: 'detail',
						data: [],
						goods_type: 2 //1普通商品，2福利券商品
					}
					obj.data.push({
						goods_id: this.dataAll.id,
						number: this.buynumber,
						sku_id: this.sku_id
					})
					uni.navigateTo({
						url: '/pages/homepage/querendingdan?msg=' + encodeURIComponent(JSON.stringify(obj))
					})
				}
				// console.log('close');
			},
			dkggtk() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.ggshow = true
			},
			// 服务弹框
			fwclose() {
				this.fwshow = false
				// console.log('close');
			},
			dkfwtk() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.fwshow = true
			},
			// 产品参数弹框
			cpclose() {
				this.cpshow = false
				// console.log('close');
			},
			dkcpcs() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.cpshow = true
			},
			// 返利购买弹框
			flclose() {
				this.flshow = false
				// console.log('close');
			},
			flgmtk() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.valueType=2
				this.ggshow = true
				// if (!this.guigeflag) {
				// 	httpRequest.toast("请先选择规格")
				// 	return
				// }
			},
			// 普通购买弹框
			ptclose() {
				this.ptshow = false
				// console.log('close');
			},
			ptgmtk() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.valueType = 1
				this.ggshow = true
				// if (!this.guigeflag) {
				// 	httpRequest.toast("请先选择规格")
				// 	return
				// }
			},
			clicktabtow(e) {
				console.log(e);
				// this.status = e.index;
				this.currenttabtow = e.index;
				// this.getdata();
			},
			// 福利商品兑换
			lijidh() {
				if (!httpRequest.checkIsLogin()) {
					httpRequest.doLogin();
					return false;
				}
				this.valueType = 4
				this.ggshow = true
				

			}
		}
	}
</script>

<style lang="scss" scoped>
	.jiahao {
		background-size: 100% 100%;
		width: 21rpx;
		height: 19rpx;
		position: absolute;
		top: 14rpx;
		right: 12rpx;
		background-image: url('../../static/image/system/jiaohao.png');
	}

	.jianhao {
		width: 22rpx;
		position: absolute;
		left: 13rpx;
		// height: 3.5rpx;
		top: 20rpx;
		height: 20rpx;

		.line {
			height: 3.5rpx;
			width: 22rpx;
			background-color: #999999;
		}
	}

	.xhtext {
		font-size: 31rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #FAB536;
	}

	.jiajian {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 164rpx;
		height: 46rpx;
		position: relative;
		border-radius: 20rpx;
		background-size: 100% 100%;
		background-image: url('../../static/image/system/jiajian.png');
	}

	.huangg {
		// width: 147rpx;
		padding: 10rpx 30rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 26rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #FAB536;
		background: rgba(250, 181, 54, 0.1);
		border-radius: 27rpx;
		border: 2rpx solid #FAB536;
	}

	.huigg {
		padding: 10rpx 30rpx;
		// width: 147rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 26rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;
		background: #F5F5F5;
		border-radius: 27rpx;
		border: 2rpx solid #F5F5F5;
	}

	.erslhuang {
		font-size: 26rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #FAB536;
	}

	.dahtext {
		font-size: 36rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #FAB536;
	}

	.guigslt {
		width: 134rpx;
		height: 134rpx;
		border-radius: 8rpx;

		image {
			width: 100%;
			height: 100%;
			border-radius: 8rpx;
		}
	}

	.kuandu {
		width: 30%;
	}

	.ershib {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #333333;
	}

	.qianhtext {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	.sanstext {
		font-size: 34rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
	}

	.renzbtn {
		width: 291.5rpx;
		height: 74rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #fff;
		border-top: 1rpx solid #E7E7E7;
		// border-right:1rpx solid #E7E7E7;
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		border-radius: 0 0 20rpx 0;
		color: #FAB536;
	}

	.quxiaobtn {
		border-radius: 0 0 0 20rpx;
		width: 291.5rpx;
		height: 74rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #fff;
		border-top: 1rpx solid #E7E7E7;
		border-right: 1rpx solid #E7E7E7;
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;
	}

	.neirong {
		padding-bottom: 250rpx;
	}

	.ljduih {
		font-size: 30rpx;
		font-family: PingFang SC-Heavy, PingFang SC;
		font-weight: 800;
		color: #FFFFFF;
		width: 286rpx;
		height: 93rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-size: 100% 100%;
		background-image: url('../../static/image/system/ljdh.png');
	}

	.yhxiank {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.gouwuc {
		margin: auto;
		width: 45rpx;
		height: 45rpx;
		background-size: 100% 100%;
		background-image: url('../../static/image/system/gouwc.png');
	}

	.heierse {
		font-size: 22rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;
	}

	.dianpu {
		margin: auto;
		width: 35rpx;
		height: 32rpx;
		background-size: 100% 100%;
		background-image: url('../../static/image/system/dianpu.png');
	}

	.huibox {
		background: #EEEEEE;
		border-radius: 8rpx;
	}

	.mjplt {
		width: 140rpx;
		height: 140rpx;
		border-radius: 18rpx;

		image {
			width: 100%;
			height: 100%;
			border-radius: 18rpx;
		}
	}

	.ershui {
		font-size: 26rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;
	}

	.wujiaox {
		width: 27rpx;
		height: 27rpx;
		background-size: 100% 100%;
		background-image: url('../../static/image/system/wjx.png');
	}

	.xiahuax {
		padding-bottom: 30rpx;
		border-bottom: 1rpx solid #F1F1F1;
	}

	.pjslt {
		width: 73rpx;
		height: 73rpx;
		border-radius: 50%;

		image {
			width: 100%;
			height: 100%;
			border-radius: 50%;
		}
	}

	.herse {
		font-size: 22rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	.dianslt {
		width: 80rpx;
		height: 80rpx;
		border-radius: 8rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.heiesb {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
	}

	.huiesb {
		font-size: 28rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #666666;
	}

	.huisetext {
		font-size: 22rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
	}

	.huisetextjx {
		font-size: 22rpx;
		font-family: PingFang SC-Medium, PingFang SC;
		font-weight: 500;
		color: #999999;
		text-decoration: line-through;
	}

	.qianshu {
		font-size: 48rpx;
		font-family: DIN-Bold, DIN;
		font-weight: bold;
		color: #FAB536;
	}

	.qianshu2 {
		font-size: 32rpx;
		font-family: DIN-Bold, DIN;
		font-weight: bold;
		color: #FAB536;
	}

	.indicator {
		@include flex(row);
		justify-content: center;

		&__dot {
			height: 6px;
			width: 6px;
			border-radius: 100px;
			background-color: rgba(255, 255, 255, 0.35);
			margin: 0 5px;
			transition: background-color 0.3s;

			&--active {
				background-color: #ffffff;
			}
		}
	}

	.indicator-num {
		padding: 2px 0;
		background-color: rgba(0, 0, 0, 0.35);
		border-radius: 100px;
		width: 35px;
		@include flex;
		justify-content: center;

		&__text {
			color: #FFFFFF;
			font-size: 12px;
		}
	}
	/deep/.u-safe-area-inset-bottom{
		padding-bottom: 0 !important;
	}
	.linefs{
		height: 80rpx;
		width: 1rpx;
		background-color: #999999;
		margin-right: 50rpx;
	}
	.fstext{
		font-size: 32rpx;
		font-family: DIN-Bold, DIN;
		font-weight: bold;
		color: #FAB536;
	}
</style>
